import { useEffect, useState } from "react";

// const URL = "http://geek.itheima.net/v1_0/channels";

export default function TryUseEffect() {
  //   const [channels, setChannels] = useState([]);
  const [count, setCount] = useState(0);
  const [num, setNum] = useState(2);

  useEffect(() => {
    console.log("useEffect 执行啦!");
  }, [count]);

  //   useEffect(() => {
  //     const getChannels = async () => {
  //       const res = await fetch(URL);
  //       const list = await res.json();
  //       console.log(222, list.data.channels);
  //       setChannels(list.data.channels);
  //     };
  //     getChannels();
  //   }, []);

  return (
    <>
      <h1>
        This is TryUseEffect Component! Count: {count} Num: {num}
      </h1>
      <button onClick={() => setCount(count + 1)}>修改 count 的值</button>
      <hr />
      <button onClick={() => setNum(num * 2)}>修改 num 的值</button>
      {/* <div>下面是频道列表</div>
      <hr /> */}
      {/* <ul>
        {channels.map((item) => (
          <li key={item.id}>{item.name}</li>
        ))}
      </ul> */}
    </>
  );
}
